﻿<%@ Page Language="C#" AutoEventWireup="true"  MasterPageFile="MasterPage.master" CodeFile="CardRegister.aspx.cs" Inherits="CardRegister" %>

<asp:Content ID="Content1" runat="server" contentplaceholderid="ContentPlaceHolder1">
<head>
    <title>Web Project</title>
<link href="css/registerStyle.css" rel="stylesheet" /> <!-- Using registerstyle.css as stylesheet -->
</head>
        <!-- Form containing the controls for register the card information -->
        <br />
        <!-- DropDownList Control to specify type of card -->
        <asp:DropDownList ID="cardTypeList" runat="server" Height="23px" Width="148px"> 
        <asp:ListItem>Visa</asp:ListItem>
        <asp:ListItem>Mastercard</asp:ListItem>
        </asp:DropDownList>
        <br />
        <br />
        <asp:Label ID="cardHolderLabel" runat="server" cssClass="labels" Text="Cardholder"></asp:Label> <!-- Name of cardholder, two validators for required field and only allowing alphabetical letters including ÅÄÖ -->
        <asp:TextBox ID="cardHolderBox" runat="server" ToolTip="Please input name of card holder" placeholder="Name of cardholder" ></asp:TextBox>
        <asp:RegularExpressionValidator ID="RegularExpressionValidator3" CssClass="labels" runat="server" ControlToValidate="cardHolderBox" ErrorMessage="Only alphabetical characters" ValidationExpression="^[a-zA-ZåäöÅÄÖ ]+$" ValidationGroup="cregister"></asp:RegularExpressionValidator>
        <asp:RequiredFieldValidator ID="RequiredFieldValidator2" CssClass="labels" runat="server" ErrorMessage="Required field" ValidationGroup="cregister" ControlToValidate="cardHolderBox"></asp:RequiredFieldValidator>
        <br />
        <br />
        <asp:Label ID="creditnumberLabel" runat="server" cssClass="labels" Text="Credit number"></asp:Label> <!-- Credit card number, two validators for required field and only allowing min and max of 16 numbers -->
        <asp:TextBox ID="creditCardNumberBox" runat="server" MaxLength="16" ToolTip="please input card number" placeholder="Credit card number" ></asp:TextBox>
         <asp:RequiredFieldValidator ID="RequiredFieldValidator1" CssClass="labels" runat="server" ErrorMessage="Required field" ValidationGroup="cregister" ControlToValidate="creditCardNumberBox"></asp:RequiredFieldValidator>
        <asp:RegularExpressionValidator ID="RegularExpressionValidator1" CssClass="labels" runat="server" ControlToValidate="creditCardNumberBox" ErrorMessage="Enter correct range of numbers (16)" ValidationExpression="[0-9]{16}" ValidationGroup="cregister"></asp:RegularExpressionValidator>
        <br />
        <br />
        <!-- Dropdownlist control for the month expiration date -->
        <asp:Label ID="expirationDateLabel" runat="server" cssClass="labels" Text="expiration Date"></asp:Label> 
        <asp:DropDownList ID="expireMonthList" runat="server">
            <asp:ListItem>01</asp:ListItem>
            <asp:ListItem>02</asp:ListItem>
            <asp:ListItem>03</asp:ListItem>
            <asp:ListItem>04</asp:ListItem>
            <asp:ListItem>05</asp:ListItem>
            <asp:ListItem>06</asp:ListItem>
            <asp:ListItem>07</asp:ListItem>
            <asp:ListItem>08</asp:ListItem>
            <asp:ListItem>09</asp:ListItem>
            <asp:ListItem>10</asp:ListItem>
            <asp:ListItem>11</asp:ListItem>
            <asp:ListItem>12</asp:ListItem>
        </asp:DropDownList>

        <!-- Dropdownlist controk for the year expiration date -->
        <asp:DropDownList ID="expireYearList" runat="server"> 
            <asp:ListItem>2013</asp:ListItem>
            <asp:ListItem>2014</asp:ListItem>
            <asp:ListItem>2015</asp:ListItem>
            <asp:ListItem>2016</asp:ListItem>
            <asp:ListItem>2017</asp:ListItem>
            <asp:ListItem>2018</asp:ListItem>
            <asp:ListItem>2019</asp:ListItem>
            <asp:ListItem>2020</asp:ListItem>
            <asp:ListItem>2021</asp:ListItem>
            <asp:ListItem>2022</asp:ListItem>
            <asp:ListItem>2023</asp:ListItem>
            <asp:ListItem>2024</asp:ListItem>
            <asp:ListItem>2025</asp:ListItem>
        </asp:DropDownList>
        <br />
        <br />
        <!-- Controls for cvc code, two validators for required field and allowing only min and max of 3 numbers -->
        <!-- Hovering mouse over "What is this" will trigger tooltip explaining where to find the cvc code -->
        <asp:Label ID="cvcLabel" runat="server" cssClass="labels" Text="CVC"></asp:Label> 
        <asp:TextBox ID="cvcBox" runat="server" MaxLength="3" Width="117px" placeholder="Enter CVC code" ></asp:TextBox> <a href="" <span title="the CVC code can be found on the back of your credit card, the three last digits">what is this?</span></a>&nbsp;
         <asp:RequiredFieldValidator ID="RequiredFieldValidator3" CssClass="labels" runat="server" ErrorMessage="Required field" ValidationGroup="cregister" ControlToValidate="cvcBox"></asp:RequiredFieldValidator>
        <asp:RegularExpressionValidator ID="RegularExpressionValidator2" CssClass="labels" runat="server" ControlToValidate="cvcBox" ErrorMessage="Enter correct range of numbers (3)" ValidationExpression="[0-9]{3}" ValidationGroup="cregister"></asp:RegularExpressionValidator>
        <br />
        <br />
        <!-- Buttons to either go back to User creation or to confirm creation of user and card -->
        <asp:Button ID="PreviousButton" runat="server" CssClass="previousbutton" OnClick="PreviousButton_Click" Text="Previous" CausesValidation="false" ToolTip="Go back to personal info" />
        <asp:Button ID="nextButton" runat="server" cssClass="confirmbutton" OnClick="confirmButton_Click" Text="Confirm" ToolTip="Go to confirmation" ValidationGroup="cregister" />
        <br />
        <br />
</asp:Content>